<!doctype html>
<html>

	<head>
		<meta charset="UTF-8">
		<title>注册</title>
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<link href="css/mui.min.css" rel="stylesheet" />
		<link rel="stylesheet" href="css/style.css" />
		<link rel="stylesheet" href="css/title.css" />
		<link rel="stylesheet" type="text/css" href="css/commontCust.css" />
		<style>
			#topPopover {
				position: fixed;
				top: 16px;
				right: 6px;
			}
			
			#topPopover .mui-popover-arrow {
				left: auto;
				right: 6px;
			}
			
			p {
				text-indent: 22px;
			}
			
			span.mui-icon {
				font-size: 14px;
				color: #007aff;
				margin-left: -15px;
				padding-right: 10px;
			}
			
			.mui-popover {
				height: 300px;
			}
			
			.mui-content {
				padding: 10px;
			}
			/*立体旋转*/
			
			.container {
				width: 50px;
				height: 50px;
				margin-top: -10px;
				position: relative;
				transform: rotateY(15deg) rotateX(-15deg);
				transform-style: preserve-3d;
				animation: xuanzhuan 8s linear infinite;
			}
			
			@keyframes xuanzhuan {
				0% {
					transform: rotateY(15deg) rotateX(45deg);
				}
				50% {
					transform: rotateY(375deg) rotateX(-45deg);
				}
				100% {
					transform: rotateY(735deg) rotateX(45deg);
				}
			}
			
			.container:hover {
				/*当鼠标划上去就停止*/
				/*animation-play-state: paused;*/
			}
			
			.container div.front {
				transform: translateZ(25px);
			}
			
			.container div.back {
				transform: translateZ(-25px) rotateY(180deg);
			}
			
			.container div.left {
				transform: translateX(-25px) rotateY(-90deg);
			}
			
			.container div.right {
				transform: translateX(25px) rotateY(90deg);
			}
			
			.container div.top {
				transform: translateY(-25px) rotateX(90deg);
			}
			
			.container div.bottom {
				transform: translateY(25px) rotateX(-90deg);
			}
			
			.container div {
				position: absolute;
				left: 0;
				top: 0;
				width: 50px;
				height: 50px;
				line-height: 50px;
				text-align: center;
				font-size: 40px;
			}
			
			body {
				background: white;
			}
		</style>
	</head>

	<body>
		<!-- 头部 -->
		<header class="mui-bar mui-bar-nav home_top" style="background: #2860DA;">
			<h1 class="mui-title"><span lang>注册</span></h1>
			<a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
		</header>
		<div style="width: 100%;height: 100%;margin-top: 50px;" class="divColumn">
			<div style="width: 100%;height:80px;background: url(img/login_bk.png);background-size: 100% 100%;">
				<div style="display: none;">
					<div class="lang-zz" id="lang-zz" style="display: none;">
						<div class="lang-main">
							<h5 lang>多语言</h5>
							<div class="langbox" data-lang="zh">
								<label>中文</label><span class="mui-icon" id="zh_lang"></span>
							</div>
							<div class="langbox" data-lang="en">
								<label>English</label><span class="mui-icon" id="en_lang"></span>
							</div>
							<div class="lang-btn">
								<a style="color:#eee;" id="quxiao" lang>取消</a>
								<a id="contain" lang>确定</a>
							</div>
						</div>
					</div>
					<div class="mui-pull-right language" id="change_lang">
						<span id="now_langage" style="color:white;font-size:16px;">English</span>
					</div>
				</div>
				<div style="width: 100%;height: 120px;margin-top: 20px;" class="divCenter">
					<div style="width: 120px;height: 120px;background: url(img/login_1.png);background-size: 100% 100%;" class="divCenter">
						<div class="container">
							<div class="front" style="background-image:url(img/logo_d.png);background-size: 100% 100%;"></div>
							<div class="back" style="background-image: url(img/logo_d.png);background-size: 100% 100%;"></div>
							<div class="left" style="background-image: url(img/logo_d.png);background-size: 100% 100%;"></div>
							<div class="right" style="background-image: url(img/logo_d.png);background-size: 100% 100%;"></div>
							<div class="top" style="background-image: url(img/logo_d.png);background-size: 100% 100%;"></div>
							<div class="bottom" style="background-image: url(img/logo_d.png);background-size: 100% 100%;"></div>
						</div>
					</div>
				</div>
			</div>
			<div style="width: 100%;margin-top: 50px;" class="divCenter">
				<img src="img/login_3.png" style="width: 30%;" />
			</div>
			<div style="margin: 30px;" class="divColumn">
				<div style="width: 100%;height: 52px;" class="divRow divColumnCenter">
					<img src="img/regiser_2.png" style="width: 6%;" />
					<input style="margin: 0px;padding: 0px;border-width: 0px;font-size: 14px;margin-left: 10px;" placeholder="请输入邀请码" lang type="text" id="invite" />
				</div>
				<div style="width: 100%;height: 1px;background: #DDDDDD;"></div>

				<div style="width: 100%;height: 52px;" class="divRow divColumnCenter">
					<img src="img/reg_3.png" style="width: 6%;" />
					<input style="margin: 0px;padding: 0px;border-width: 0px;font-size: 14px;margin-left: 10px;" placeholder="请输入昵称" lang type="text" id="nickname" />
				</div>
				<div style="width: 100%;height: 1px;background: #DDDDDD;"></div>

				<div style="width: 100%;height: 52px;" class="divRow divColumnCenter">
					<img src="img/login_4.png" style="width: 6%;" />
					<a class="" style="padding-top: 4px;float: left;color:#ffc700;margin-left: 4px;" id="nation">+86</a>
					<span style="color:#fff;padding-top: 8px;float: left;">|</span>
					<input type="text" id='phone' style="margin: 0px;padding: 0px;border-width: 0px;font-size: 14px;margin-left: 10px;" placeholder="您的手机号码" lang style="width:57%;">
					<input type="hidden" value="中国" id='country' name="country" style="margin: 0px;padding: 0px;border-width: 0px;font-size: 14px;margin-left: 10px;">
					<input type="hidden" value="86" id='area_code' name="area_code" style="margin: 0px;padding: 0px;border-width: 0px;font-size: 14px;margin-left: 10px;">
				</div>
				<div style="width: 100%;height: 1px;background: #DDDDDD;"></div>
				<div style="width: 100%;height: 52px;" class="divRow divColumnCenter">
					<img src="img/reg_4.png" style="width: 6%;" />
					<input style="margin: 0px;padding: 0px;border-width: 0px;font-size: 14px;margin-left: 10px;" placeholder="输入6~32位数字加字母的登录密码" lang type="password" id="login_pwd" />
				</div>
				<div style="width: 100%;height: 1px;background: #DDDDDD;"></div>
				<div style="width: 100%;height: 52px;" class="divRow divColumnCenter">
					<img src="img/reg_6.png" style="width: 6%;" />
					<input style="margin: 0px;padding: 0px;border-width: 0px;font-size: 14px;margin-left: 10px;" placeholder="输入6位支付密码" lang type="password" id="trade_pwd" />
				</div>
				<div style="width: 100%;height: 1px;background: #DDDDDD;"></div>
				<div style="width: 100%;height: 52px;" class="divRow divColumnCenter">
					<img src="img/reg_7.png" style="width: 6%;" />
					<input type="text" id='random_code' style="margin: 0px;padding: 0px;border-width: 0px;font-size: 14px;margin-left: 10px;width: 60%;" placeholder="请输入右侧验证码" lang>
					<img class="kanbuq" id='verify' src="" style="cursor:pointer;height:38px;width:30%;" />
				</div>
				<div style="width: 100%;height: 1px;background: #DDDDDD;"></div>
				<div style="width: 100%;height: 52px;" class="divRow divColumnCenter">
					<img src="img/reg_8.png" style="width: 6%;" />
					<input style="margin: 0px;padding: 0px;border-width: 0px;font-size: 14px;margin-left: 10px;width: 45%;" placeholder="请输入验证码" lang type="text" id="code" />
					<span class="yanzhengma" id="getCode" data-type="reg_phone" lang>获取验证码</span>
				</div>
				<div style="width: 100%;height: 1px;background: #DDDDDD;"></div>

				<div style="width: 100%;background: #2860DA;height: 52px;border-radius: 30px;margin-top: 40px;" class="divCenter" id='reg'>
					<span style="color:white;font-size: 16px;" lang>注册</span>
				</div>
			</div>

		</div>

		<!--<div class="mui-content-padded regist">
			<div class="mui-input-group">
				<div class="mui-input-row">
					<label lang>邀请码</label>
					<input type="text" id="invite" class="mui-input-clear" placeholder="请输入邀请码" lang>
				</div>
				<div class="mui-input-row">
					<label lang>昵称</label>
					<input type="text" id='nickname' class="mui-input-clear" placeholder="请输入昵称" lang>
				</div>
				<div class="mui-input-row">
					<label lang>手机号</label>
					<a class="" style="padding-top: 9px;float: left;color:#ffc700;" id="nation">+86</a>
					<span style="color:#fff;padding-top: 8px;float: left;">|</span>
					<input type="text" id='phone' class="mui-input-clear" placeholder="您的手机号码" lang style="width:57%;">
					<input type="hidden" value="中国" id='country' name="country">
					<input type="hidden" value="86" id='area_code' name="area_code">
				</div>
				<div class="mui-input-row">
					<label lang>登录密码</label>
					<input type="password" id='login_pwd' placeholder="输入6~32位数字加字母" lang>
				</div>
				<div class="mui-input-row">
					<label lang>支付密码</label>
					<input type="password" id='trade_pwd' placeholder="输入6位支付密码" lang>
				</div>
				<div class="mui-input-row yzm">
					<label lang>随机码</label>
					<input type="text" id='random_code' style="width: 40%;" placeholder="请输入右侧验证码" lang>
					<span class="yanzhengma">
						<img class="kanbuq" id='verify' src="" style="cursor:pointer;height:38px;width:30%;" />
					</span>
				</div>

				<div class="mui-input-row yzm">
					<label lang>验证码</label>
					<input type="text" id='code' style="width: 45%;" placeholder="请输入验证码" lang>
					<span class="yanzhengma" id="getCode" data-type="reg_phone" lang>获取验证码</span>
				</div>

				<div class="mui-button-row" style="margin-top:30px;">
					<button type="button" class="mui-btn mui-btn-block" id='reg' lang>确定</button>
				</div>
			</div>
		</div>-->

		<script src="lang/pages.js"></script>
		<script src="js/mui.js"></script>
		<script src="js/config.js"></script>
		<script src="js/common.js"></script>
		<script src="js/sockjs.js"></script>
		<script src="js/get_sms_code.js"></script>
		<script src="resource/login/reg.js"></script>
		<script>
			mui.plusReady(function() {
				plus.navigator.setStatusBarBackground("#2860DA");
			});
		</script>
	</body>

</html>